<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>动态检测结果</title>
    <link rel="icon" href="/static/image/favicon.ico" />
    <style>
          html, body {
            width: 100%;
            height: 100%;
            padding:0;
            margin:0;
            background-size: cover;
            {#background-color: rgba(255,255,200,0.1);#}
            background-color: rgba(1,1,1,0.1);
        }
        .box {
            margin:20px auto 0;
            text-align:center;
        }
        #video {
            width: 800px;
            height:680px;
            box-shadow: 10px 10px 10px rgba(0, 0, 0, .5);
            border-radius: 2%;
        }
        input {
            padding:5px 10px;
            background-color: #fcfcfc;
            border: 2px solid #ccc;
            border-radius: 20%;
        }
        h2 {
            text-align:center;
            padding:0;
            margin:0;
        }
    </style>
</head>
<body>
<input type="button" name="Submit" value="<<返回首页">
    <!-- 显示视频流 -->
    <h2>模型加载中，请耐心等侯.....</h2>
    <div class="box"><img src="http://127.0.0.1:8000/detect/" id="video"></div>
<script>
    var input = document.querySelector('input');
    input.onclick=function(){
        var img = document.querySelector('img');
        img.src='';
        javascript:history.back(-1);
    }
</script>
</body>
</html>

